<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html   xmlns="http://www.w3.org/1999/xhtml"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:h="http://java.sun.com/jsf/html">
    <h:head>
        <title><ui:insert name="title"><ui:insert name="title">Title</ui:insert></ui:insert></title>
        <h:outputStylesheet>
            #page {
                position: absolute;
                top: 0px;
                left: 0px;
                right: 0px;
            }

            #header {
                position: relative;
            }

            #center {
                padding: 5px;
            }
            
            .leftmenu, .rightmenu {
                width: 200px;
            }

            .contentplace, .leftmenu, .rightmenu {
                vertical-align: top;
            }
            
            .caption {
                font-size: 30px;
                font-weight: bold;
            }
            
            .button {
                /*Step 2: Basic Button Styles*/
                display: block;
                height: 19px;
                width: 100px;
                background: #34696f;
                border: 2px solid rgba(33, 68, 72, 0.59);

                /*Step 3: Text Styles*/
                color: rgba(0, 0, 0, 0.55);
                text-align: center;
                font-size: 15px;

                /*Step 4: Fancy CSS3 Styles*/
                background: -webkit-linear-gradient(top, #34696f, #2f5f63);
                background: -moz-linear-gradient(top, #34696f, #2f5f63);
                background: -o-linear-gradient(top, #34696f, #2f5f63);
                background: -ms-linear-gradient(top, #34696f, #2f5f63);
                background: linear-gradient(top, #34696f, #2f5f63);

                -webkit-border-radius: 50px;
                -khtml-border-radius: 50px;
                -moz-border-radius: 50px;
                border-radius: 50px;
                
                text-shadow: 0 2px 2px rgba(255, 255, 255, 0.2);
            }
            
            /*Step 3: Link Styling*/
            a.button {
                text-decoration: none;
            }
            
            /*Step 5: Hover Styles*/
            a.button:hover {
                background: #3d7a80;
                background: -webkit-linear-gradient(top, #3d7a80, #2f5f63);
                background: -moz-linear-gradient(top, #3d7a80, #2f5f63);
                background: -o-linear-gradient(top, #3d7a80, #2f5f63);
                background: -ms-linear-gradient(top, #3d7a80, #2f5f63);
                background: linear-gradient(top, #3d7a80, #2f5f63);
            }
        </h:outputStylesheet>
    </h:head>
    <h:body>
        <div id="page">
            <div id="logo"><h:graphicImage width="226" height="48" url="/img/logo.svg" /></div>
            <div id="header"><ui:insert name="header">Header</ui:insert></div>
            <div id="center"><ui:insert name="content">Content</ui:insert></div>
        </div>
    </h:body>
</html>